<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
</head>

<body>
  <button id="btnGET_1">GET不带参数</button>
  <button id="btnGET_2">GET带参数</button>

  <button id="btnPOST_1">POST不带请求体</button>
  <button id="btnPOST_2">POST带请求体</button>

  <script src="./lib/common.js"></script>
  <script src="./lib/axios.js"></script>

  <script>
    /*
      GET请求接口地址: /api/get
      POST请求接口地址: /api/post
    */

    // ======================== 配置全局请求的根路径 ======================== 


    // axios的简写形式

    // ======================== 发送get请求，不带参数 ======================== 
    qs('#btnGET_1').addEventListener('click', function () {
      axios.get('http://www.liulongbin.top:3009/api/get').then(({data : res}) => {
        console.log(res)
      })
    })

    // ======================== 发送get请求，带参数 ======================== 
    qs('#btnGET_2').addEventListener('click', function () {
      axios.get('http://www.liulongbin.top:3009/api/get',{
        params : {
          id : 1,
          age : 13
        }
      }
      ).then(({data : res}) => {
        console.log(res)
      })
    })

    // ======================== 发送post请求，不带参数 ======================== 
    qs('#btnPOST_1').addEventListener('click', function () {

    })

    // ======================== 发送post请求，带参数 ======================== 
    qs('#btnPOST_2').addEventListener('click', function () {
      axios.post('http://www.liulongbin.top:3009/api/post',{id : 1 ,uname : 'z'} , {
        timeout :3000
      }).then(({data : res}) => {
        console.log(res)
      })
    })
  </script>
</body>

</html>